 <template>
	 <div>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="cid"
        label="姓名111">
      </el-table-column>
      <el-table-column
        prop="cname"
        label="班级名称">
      </el-table-column>
    </el-table>
	  <!--  分页组件 -->
	  <fen-ye :page="page" @mypage="getData" ></fen-ye>
	</div>
  </template>

  <script>
	  /*  拿出分页组件*/
	  //  局部组件
	 import ax from 'axios'
    export default {
      data() {
        return {
          tableData: [],
		   page: {
			   currPage:2,
			   pageSize:2,
			   total:10
		   }
        }
      },
	  methods:{
		  
		  getData(obj){
			  // val 代表的是一个pageSize
			  this.page.pageSize=obj.pageSize;
			  this.page.currPage=obj.currPage;
			  this.initTable();  
		  },
		  
		 
		   handleSizeChange(val) {
		          //console.log(`每页 ${val} 条`);
				  this.page.pageSize=val;
				  this.initTable();
		        },
		        handleCurrentChange(val) {
		         // console.log(`当前页: ${val}`);
				 this.page.currPage=val;
				 this.initTable();
		        },
		  // 方法
		  initTable(){
			  // 分页查询: currPage   pageSize
			  // page 对象 =  {currPage：1 ，pageSize:2}
			  ax.get("http://localhost:8080/ssmfinal_Web_exploded/tabClass",{params:this.page}).then(res=>{
			  				let data= res.data.t.list;
			  				// 
			  				this.tableData = data;
							// 给 total赋值 数据的总条数
							this.page.total=res.data.t.total;
			  })
		  }
	  },
	  created(){
             this.initTable();
		  
	  },
	 
    }
  </script>